<template>
  <!-- 谁最牛 -->
  <div class="cattleShake-wrap">
    <transition enter-active-class="slideInRight faster animated">
      <wait v-if="gameStatus === 1" />
      <shakeMain v-if="gameStatus === 2" />
      <rank v-if="gameStatus === 3" type="shake" />
    </transition>
  </div>
</template>
<script>
import { mapState } from 'vuex';
import wait from '@/views/cattleShake/wait.vue';
import shakeMain from '@/views/cattleShake/main.vue';
import rank from '@/components/gameRank/cattleRank.vue';

export default {
  name: 'cattleShakeIndex',
  computed: {
    ...mapState({
      gameStatus: (state) => state.game.gameStatus,
    }),
  },
  components: {
    wait,
    shakeMain,
    rank,
  },
  data() {
    return {};
  },
  created() {},
  methods: {
  },
  beforeCreated() {},
};
</script>
<style lang="less" scoped>
.cattleShake-wrap {
  position: relative;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  overflow-y: scroll;
}
</style>
